<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    
</body>
</html>
<script>
            
         //箭头函数 
         //特点就是更短 和解决匿名函数中this指向全局作用域的问题  
         //箭头函数语法简洁 但是很多场景不适合使用 
         //箭头函数不能使用arguments super和new.target 也不能使用构造函数 此外构造函数页没有portotype   
        
         //是一种对函数表达式的缩写(也就是所说的赋值式函数) ---- 对声明时函数没作用
        
//语法
        // 	省略了function 关键字   ()=>{}
        // 	箭头函数没有this   里的this就是上下文(context) 就是箭头函数外部作用域的this
        // 	  +1箭头函数不受call/apply/bind的影响（修改函数this指向）也就是说箭头函数不能更改this
        // 	箭头函数在定义的时候就已经决定好了  定义好后任何方法都无法更改
                        

        // 	  +2箭头函数内部没有arguments(所有实参的结合)
        // 	箭头函数没有这个变量


        // 	  +3箭头函数传递参数时候
        // 	如果只有一个行参可以不写小括号  
        // 	如果没有行参或者两个以上，必须给小括号


        // 	  +4箭头函数的函数体
        // 	如果只有一句话可以省略大括号{}
        // 	如果返回对象的话 加()    //({a:1,b:2})
        // 	否则就必须写
        // 	当你省略{}的时候，函数会自动return
            
            
        //     +5函数的参数默认值
        // 	函数在定义形参的时候给一个默认值(备胎)
        // 	如果你传递了实参，    	  就用你传递的实参  
        // 	如果没传递实参            就会用定义的默认值
        // 	      ……
        // 	直接在形参的位置写     形参=默认值
        // 	      ……箭头函数也可以设置默认值
        // 	如果你给箭头函数设置默认值
        // 	那么一个参数的时候，也要写小括号


        箭头函数的的特性:
                1.箭头函数中的this指向上下文中的this；   
                2.箭头函数不能更改this；
                3.箭头函数中没有arguments;
                4.箭头函数中只有一个形参时可以省略小括号；
                5.箭头函数中只有一个语句时可以省略花括号；
		6.箭头函数中只有一个与并且是return语句时，可以省略花括号和return

			1.箭头函数没有this：
				//  +箭头函数的this就是上下文中的this
				//  +就是箭头函数外部作用域(函数)中的this
				//外部作用域指的就是函数
					const obj={
						fun:()=>{
							console.log(this)//window:
							//这个函数的上一级作用域是window
							// 所以这个函数里面的this就是window这个作用域里面的this，window作用域里面的this是window
						},
						fn:function(){
							console.log(this)//obj
							const f=function(){
								console.log(this)//window
							}
							const n=()=>{
								console.log(this)//obj
								//这个函数的上一级作用域是obj.fn()函数，
								//所以这个函数里面的this就是obj.fn()函数里面的this，obj.fn()函数中的this是obj
							}
							f()
							n()
						}
					}
					obj.fun()
					obj.fn()
			2.箭头函数不受call/apply/bind的影响:不能修改this指向
					// +已经定义，任何方法都不能更改this
					var obj={
						name:'我是obj'
					}
					const fn=()=>{
						console.log(this)
					}
					fn()//window
					fn.call(obj)//window
			3. 箭头函数内没有arguments
					const fn=()=>{
						console.log(arguments)
					}
					fn()//is not defined
			4.箭头函数只有一个形参时可以省略括号
					// 没有或多个都不能省略
					const fn=a=>{
						console.log(a)
					}
					fn(100)//100
			5.箭头函数只有一句话时可以省略花括号
					const fn=a=>console.log(a)
					fn(100)//100
			6.箭头函数只有一句话并且还是return语句时，可以省略花括号和return
					const fn=a=>a
					console.log(fn(100))
es6函数的默认值：
                函数形参的默认值
		函数在定义形参的时候给一个默认值:形参=默认值；
		使用规则：
                        如果传递了实参，就用实参；(优先考虑)   即函数的备胎 
                        
			如果不传参或传Undefined，如果有默认值就使用默认值，没有默认值就是undefined;
                                function fn(a=100,b=200,c){
                                        console.log(a,b)//10,200,undefined
                                }
                                fn(10)
                        箭头函数也可以设置形参的默认值：如果给箭头函数的形参设置了默认值，一个参数也需要设置括号；
                                var fn=(a=100)=>{
                                        console.log(a)
                                }
                                fn()
                **定义在全局环境中的变量var和函数会成为window的属性和方法；  
                **函数默认值参数：独立作用域;
                        **独立作用域中的访问变量时：
                                独立作用域中如果没有创建该变量就去上一级中找变量，如果有直接使用；
                                如果没有就再去上上级找，直到widnow都没有，会返回变量 is not defined;
                                计算 
                                1，function f4(a,b=a){
                                        console.log(a,b)
                                }
                                f4(10)//10，10
                                自己作用域中的有就使用自己作用域中的变量；
                                2.      let x=10;
                                        function f4(a,b=x){
                                                let x=20;
                                                console.log(a,b)//undefined 10   独立作用域的规则
                                                console.log(x)//20  作用域中的变量访问的规则
                                        }
                                        f4()
                                        自己作用域中没有，就去上一级作用域中找变量，有x直接使用


</script>